﻿﻿﻿﻿<!DOCTYPE html>

<html>

<head>
    <meta name="viewport" content="width=device-width" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="/wwwroot/common/css/sapar.css?v=@FileServer.Common.VersionNo.VNo" />
    <link rel="stylesheet" type="text/css" href="/wwwroot/common/css/common.css?v=@FileServer.Common.VersionNo.VNo" />
    <link rel="stylesheet" type="text/css" href="/wwwroot/common/css/jquery-ui.css" />
    <script type="text/javascript" src="/wwwroot/common/js/jquery-1.12.4.js"></script>
    <script type="text/javascript" src="/wwwroot/common/js/jquery-ui.js"></script>
    <script type="text/javascript" src="/wwwroot/common/js/dialog.js?v=@FileServer.Common.VersionNo.VNo"></script>
    <script src="/wwwroot/My97DatePicker-4.72/WdatePicker.js"></script>
    <script src="/wwwroot/common/js/SelectAll.js?v=@FileServer.Common.VersionNo.VNo"></script>
    <script src="/wwwroot/common/js/SelectTr.js?v=@FileServer.Common.VersionNo.VNo"></script>
    <link href="/wwwroot/common/css/Page.css?v=@FileServer.Common.VersionNo.VNo" rel="stylesheet" />
    <link href="/wwwroot/common/css/cloudDrive.css" rel="stylesheet" />
    <link rel="stylesheet" href="/wwwroot/common/js/skin/layer.css" />
    <style>
        .context-menu {
            display: none;
            position: absolute;
            z-index: 1000;
            background: white;
            border: 1px solid #ccc;
            box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
            min-width: 120px;
        }

        .context-menu ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .context-menu li {
            padding: 8px 12px;
            cursor: pointer;
        }

        .context-menu li:hover {
            background: #f0f0f0;
        }
    </style>
    <script src="/wwwroot/common/js/common.js?v=@FileServer.Common.VersionNo.VNo"></script>
    <script type="text/javascript" src="/wwwroot/common/js/cloudDrive.js"></script>
    <title></title>
    <style type="text/css">
        html,
        body {
            height: 100%;
            margin: 0px;
            padding: 0px;
            width: 100%;
        }
    </style>
</head>

<body style="height:100%;width:100%;margin:0px;padding:0px;">
    <script>
        $(document).ready(function () {
        });

        function createProductModel(guid) {
            $.post("createProductModel", { "flag": Math.random(), pmguid: guid }, function (result) {
                var myobj = (result.data);
                if (result.respCode == "200") {
                    alert("产品型号创建成功！");
                    window.location.href = "list";
                }
            });
            return;
        }

        function changeStatus(dguid) {
            $.post("changeStatus", { "flag": Math.random(), guid: dguid }, function (result) {
                var jsonresult = (result);
                if (jsonresult.respCode == "200") {
                    window.location.reload();
                }
                else {
                    alert(jsonresult.respMsg);
                    return;
                }
            });
        }

        function handleUpLevel() {
            const urlParams = new URLSearchParams(window.location.search);
            const spaceType = urlParams.get('spaceType') || '';
            const guid = urlParams.get('parentGuid') || '';
            const token = localStorage.getItem('token');
            if (!guid) {
                alert('当前是最上层目录');
                return;
            }
            $.ajax({
                url: 'http://localhost:8060/api/file/getParnetGuid',
                method: 'POST',
                headers: {
                    'Authorization': `Bearer ${token}`
                },
                data: {
                    guid: guid
                },
                success: function (response) {
                    var   toBackDirGuid = response.data;
                     window.location.href = `list.html?parentGuid=${toBackDirGuid}&spaceType=${spaceType}`;
                   
                },
                error: function (xhr) {
                    console.error('API request failed:', xhr);
                    alert('获取上级目录失败：' + (xhr.responseJSON?.message || xhr.statusText));
                }
            });
            
            

        }
      
        function getDirInfo() {
            const urlParams = new URLSearchParams(window.location.search);
            const spaceType = urlParams.get('spaceType') || '';          
            const token = localStorage.getItem('token');
            const guid = urlParams.get('parentGuid') || '';
         

            $.ajax({
                url: 'http://localhost:8060/api/file/getGuid',
                method: 'POST',
                headers: {
                    'Authorization': `Bearer ${token}`
                },
                data: {
                    guid: guid
                },
                success: function (response) {

                    var path = "";
                    if (response && response.data) {
                        path = response.data.path+"/"+response.data.name;
                    }
                    $('#lab_dirpath').text(path);
                },
                error: function (xhr) {
                    console.error('API request failed:', xhr);
                    alert('获取目录失败：' + (xhr.responseJSON?.message || xhr.statusText));
                }
            });
        }
    </script>

    <div id="saper-container">
        <form id="searchForm" name="searchForm" action="list" method="post">
            <div id="saper-hd"></div>
            <div id="saper-bd">
                <div class="subfiled clearfix">
                    <h2>云盘</h2>
                </div>
                <div class="subfiled-content">
                    <div class="search-box clearfix">
                        <div class="kv-item clearfix">
                            <label>文件夹/文件名称：</label>
                            <div class="kv-item-content">
                                <input type="text" id="name" value="" name="name" placeholder="名称" />
                            </div>
                        </div>
                        <a href="javascript:;" id="but_Search1" name="but_Search1"
                            class="sapar-btn sapar-btn-recom query-btn" onclick="loadFileList()">查询</a>
                        <a href="javascript:;" id="but_upLevel" name="but_upLevel"
                            class="sapar-btn sapar-btn-recom query-btn" onclick="handleUpLevel()">上一级</a>
                        <script>
                            const parentGuid = new URLSearchParams(window.location.search).get('parentGuid') || '';
                            const spaceType = new URLSearchParams(window.location.search).get('spaceType') || '';
                        </script>
                        <a href="javascript:;" id="but_add" name="but_add" class="sapar-btn sapar-btn-recom query-btn"
                            style="float: right; margin-right: 130px;"
                            onclick="window.location.href='uploadfile.html?parentGuid=' + parentGuid+ '&spaceType=' + spaceType">添加文件</a>
                        <a href="javascript:;" id="but_add2" name="but_add2" class="sapar-btn sapar-btn-recom query-btn"
                            style="float: right; margin-right: 100px;"
                            onclick="window.location.href='addDir.html?parentGuid=' + parentGuid + '&spaceType=' + spaceType">添加目录</a>
                    </div>
                    <div>当前位置： <label id="lab_dirpath"></label></div>
                    <div class="table">
                        <div class="table-box">
                            <script>
                                function loadFileList() {
                                    const urlParams = new URLSearchParams(window.location.search);
                                    const parentGuid = urlParams.get('parentGuid') || '';
                                    const spaceType = urlParams.get('spaceType') || '';
                                    const searchName = $('#name').val();

                                    $.ajax({
                                        url: 'http://localhost:8060/api/file/getFileList',
                                        method: 'POST',
                                        data: {
                                            parentGuid: parentGuid,
                                            name: searchName,
                                            spaceType: spaceType
                                        },
                                        success: function (response) {
                                            if (response && response.data && Array.isArray(response.data)) {
                                                var html = '';
                                                response.data.forEach(function (item) {
                                                    html += '<div style="height: 120px;width: 120px;" class="bordered-div" data-guid="' + (item.guid || '') + '" onclick="if(\'' + item.type + '\' == \'dir\') { handleFileClick(\'' + (item.guid || '') + '\',\'' + spaceType + '\') }">' +
                                                        '<div style="width: 50px;height: 50px;"><img src="/wwwroot/images/cloudDrive/' + (item.type === 'dir' ? 'dir' : 'file') + '.png" style="width:100%;height:100%;object-fit:contain;"></div>' +
                                                        '<div style="font-size:12px;line-height:1.2;">' +
                                                        '<div style="margin:2px 0;">' + (item.name || '') + '</div>';
                                                        if(item.type=="file")
                                                        {
                                                            html += '<div style="margin:2px 0;">' + (item.size || '0') + 'KB</div>' ;
                                                        }
                                                        html += '<div style="margin:2px 0;">' + (item.update_time || '') + '</div>' +
                                                        '</div>' +
                                                        '</div>';
                                                });
                                                $('.table-box').html(html);
                                            } else {
                                                console.error('Invalid response format:', response);
                                                alert('获取文件列表失败：数据格式不正确');
                                            }
                                        },
                                        error: function (xhr) {
                                            console.error('API request failed:', xhr);
                                            alert('获取文件列表失败：' + (xhr.responseJSON?.message || xhr.statusText));
                                        }
                                    });
                                }

                                // Initial load
                                $(document).ready(function () {
                                    loadFileList();
                                    getDirInfo();
                                });

                                // Search button click handler
                                $('#but_Search').click(function () {
                                    loadFileList();
                                });
                            </script>
                        </div>
                    </div>
                </div>
            </div>
            <div id="saper-ft"></div>
        </form>
    </div>

    <!-- Context Menu -->
    <div id="context-menu" class="context-menu">
        <ul>
            <li onclick="handleMenuClick('下载',1)">下载</li>
            <li onclick="handleMenuClick('查看',2)">查看</li>
            <li onclick="handleMenuClick('分享',3)">分享</li>
            <li onclick="handleMenuClick('删除',4)">删除</li>
        </ul>
    </div>

    <script>
        let currentItemGuid = null;

        // Show context menu on right click
        $(document).on('contextmenu', '.bordered-div', function (e) {
            e.preventDefault();
            currentItemGuid = $(this).data('guid');

            // Position menu at cursor
            $('#context-menu')
                .css({
                    left: e.pageX + 'px',
                    top: e.pageY + 'px'
                })
                .show();
        });

        // Hide menu when clicking elsewhere
        $(document).click(function () {
            $('#context-menu').hide();
        });

        // Handle menu item clicks
        function handleMenuClick(action, type) {
            //alert(action + ': ' + currentItemGuid);
            $('#context-menu').hide();
            if (type == 1) {

                window.open("http://localhost:8060/api/file/getDownloadUrl?guid="+currentItemGuid);    
                
            }
            else if (type == 2) {
                $.ajax({
                    url: 'http://localhost:8060/api/file/getFileUrl',
                    method: 'POST',
                    data: {
                        guid: currentItemGuid,
                    },
                    success: function (response) {
                        window.open(response.data);                      
                    },
                    error: function (xhr) {
                        alert('查询失败');
                    }
                });
            }
            else if (type == 3) {

            }
            else if (type == 4) {
                $.ajax({
                    url: 'http://localhost:8060/api/file/delFile',
                    method: 'POST',
                    data: {
                        guid: currentItemGuid,
                    },
                    success: function (response) {
                        alert('删除成功');
                        window.location.href = `list.html?parentGuid=${parentGuid}&spaceType=${spaceType}`;
                    },
                    error: function (xhr) {
                        alert('删除失败');
                    }
                });
            }
        }
    </script>

</body>

</html>
